<template>
  <div class="bg-white p-[20px] pb-[100px]">
    <!-- <div class="text-l font-bold mb-4">开户信息</div> -->
    <div class="item">
      <div class="item-label">商家号:</div>
      <div class="item-value">{{ detail.merchantNo }}</div>
    </div>
    <div class="item">
      <div class="item-label">商家交易流水号:</div>
      <div class="item-value">{{ detail.orderCode }}</div>
    </div>
    <div class="item">
      <div class="item-label">拉卡拉交易流水号:</div>
      <div class="item-value">{{ detail.paymentOrderCode }}</div>
    </div>
    <div class="item">
      <div class="item-label">拉卡拉对账单流水号:</div>
      <div class="item-value">{{ detail.logNo }}</div>
    </div>
    <div class="item">
      <div class="item-label">交易大类:</div>
      <div class="item-value">{{ detail.orderTypeName }}</div>
    </div>
    <div class="item">
      <div class="item-label">拆单属性：</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="text-l font-bold mb-4">拆单信息</div>
    <div class="item">
      <div class="item-label">子单交易流水号:</div>
      <div class="item-value">
        {{ detail.nothing }}
      </div>
    </div>
    <div class="item">
      <div class="item-label">子单对账单流水号:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">外部子交易流水号:</div>
      <div class="item-value">
        {{ detail.nothing }}
      </div>
    </div>
    <div class="item">
      <div class="item-label">商家号:</div>
      <div class="item-value">
        {{ detail.nothing }}
      </div>
    </div>
    <div class="item">
      <div class="item-label">子单交易流水号:</div>
      <div class="item-value">
        {{ detail.nothing }}
      </div>
    </div>
    <div class="item">
      <div class="item-label">终端号:</div>
      <div class="item-value">
        {{ detail.nothing }}
      </div>
    </div>
    <div class="item">
      <div class="item-label">金额（单位：分）:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">账户端交易订单号:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <!-- 钱包类型:
交易状态描述:
订单金额（单位：分）：
付款人实付金额（单位：分）:
账户端结算金额（单位：分）:
商家侧优惠金额（单位：分）（账户端）:
账户端优惠金额（单位：分）:
账户端其它优惠金额（单位：分）：
交易完成时间:
用户标识1:
用户标识2:
付款银行:
银行卡类型:
活动ID:
 -->
    <div class="item">
      <div class="item-label">钱包类型:</div>
      <div class="item-value">{{ detail.payTypeName }}</div>
    </div>
    <div class="item">
      <div class="item-label">交易状态描述:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <!-- 订单金额（单位：分）： -->
    <div class="item">
      <div class="item-label">订单金额（单位：元）:</div>
      <div class="item-value">{{ detail.orderPrice }}</div>
    </div>
    <div class="item">
      <div class="item-label">付款人实付金额（单位：元）:</div>
      <div class="item-value">{{ detail.payPrice }}</div>
    </div>
    <div class="item">
      <div class="item-label">账户端结算金额（单位：分）:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <!-- 商家侧优惠金额（单位：分）（账户端）: -->
    <div class="item">
      <div class="item-label">商家侧优惠金额（单位：分）（账户端）:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">账户端优惠金额（单位：分）:</div>
      <div class="item-value">
        {{ detail.nothing }}
      </div>
    </div>
    <!-- 账户端其它优惠金额（单位：分）： -->
    <div class="item">
      <div class="item-label">账户端其它优惠金额（单位：分）:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">交易完成时间:</div>
      <div class="item-value">
        {{ detail.updatedAt }}
      </div>
    </div>
    <div class="item">
      <div class="item-label">用户标识1:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">用户标识2:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">付款银行:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">银行卡类型:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">活动ID:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="text-l font-bold mb-4">账户端返回信息域</div>
    <div class="item">
      <div class="item-label">用户标识:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">用户子标识:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">活动ID:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">优惠功能信息:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>

    <div class="text-l font-bold mb-4">合单退款拆单信息</div>
    <div class="item">
      <div class="item-label">外部子退款交易流水号:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">商家号:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">终端号:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">申请退款金额（单位：分）:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">拉卡拉子交易流水号:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">对账单流水号:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">子交易状态:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">处理结果码:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>
    <div class="item">
      <div class="item-label">处理描述:</div>
      <div class="item-value">{{ detail.nothing }}</div>
    </div>

    <div class="bottom">
      <el-button @click="router.go(-1)">返回</el-button>
    </div>
  </div>
</template>

<script setup lang="ts">
import HFAPI from "@/api/hf";
import PaymentAPI, { PaymentOrderDetailVO } from "@/api/payment";

const detail = ref<PaymentOrderDetailVO>({});
const route = useRoute();

const router = useRouter();

PaymentAPI.getOrderDetail(route.query.id as string).then((res) => {
  detail.value = res;
});
</script>

<style lang="scss" scoped>
.item {
  display: flex;
  gap: 20px;
  padding: 20px 0;
  &-label {
    width: 300px;
    flex-shrink: 0;
    text-align: right;
    font-weight: 400;
  }
  &-value {
    flex: 1;
  }
}
.bottom {
  width: 100%;
  position: fixed;
  background-color: #fff;
  bottom: 0;
  left: 0;
  height: 60px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.01);
}
</style>
